<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<%@ taglib uri="http://www.springframework.org/tags" prefix="s"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>

<!DOCTYPE html>
<html lang="en">
<head>
<title><s:message code="app.title" /></title>
<%@ include file="Include.jsp"%>
<script type="text/javascript">
	
	$(document).ready(function() {
		var oTable = $('#voyageTable').dataTable( {
			 	"bDestroy": true,
		        "bProcessing": false,
		        "iDisplayLength": 10,
		        "bFilter": false,
		        "bLengthChange": false,
		        "aoColumnDefs": [
		          { 'bSortable': false, 'aTargets': [7] }
		       	]
		 	} );
		
		$('#addVoyage').click(function(){
			$('#voyageListForm').attr('action','AddVoyage');
			$('#voyageListForm').attr('method','get');
			$('#voyageListForm').submit();
		});
		
	});
	
	function edit(voyageId){
		$('#voyageEditForm').attr('action','EditVoyage?voyageId='+voyageId);
		
		$('#voyageId').val(voyageId);
		
		$('#voyageEditForm').attr('method','get');
		$('#voyageEditForm').submit();
}
	
</script>
</head>
<body>
<c:set var="DD/MM/YYYY" value="<%=new java.util.Date()%>" />
	<div class="container">
		<%@ include file="Menu.jsp"%>
		<h2><s:message code="voyageForm.listheader" /></h2>
		<hr>
		<form:form id="voyageEditForm" >
			<input type="hidden" id="voyageId" name="voyageId" />
		</form:form>
		<form:form id="voyageListForm" >
		<table class="table table-hover table-bordered" id="voyageTable">
				<thead>
					<tr>
						<th><s:message code="vesselForm.vesselname" /></th>
						<th><s:message code="voyageForm.voyagename" /></th>
						<th><s:message code="voyageForm.portname" /></th>
						<th><s:message code="voyageForm.cutoff" /></th>
						<th><s:message code="voyageForm.eta" /></th>
						<th><s:message code="voyageForm.etd" /></th>
						<th><s:message code="voyageForm.enscutoff" /></th>
						<th><s:message code="voyageForm.acdsicutoff" /></th>
						<th><s:message code="app.action" /></th>
					</tr>
				</thead>
				
				<tbody>
					<c:forEach items="${voyageList}" var="voyage" >
						<tr>
							<td>
								<c:out value="${voyage.vesselname}"></c:out>
							</td>
							<td>
								<c:out value="${voyage.voyagename}"></c:out>
							</td>
							<td>
								<c:out value="${voyage.portname}"></c:out>
							</td>
							<td>
								<fmt:formatDate value="${voyage.cutoff}" dateStyle="short" pattern="dd/MM/yyyy" />
							</td>
							<td>
								<fmt:formatDate value="${voyage.eta}" dateStyle="short" pattern="dd/MM/yyyy"/>
							</td>
							<td>
								<fmt:formatDate value="${voyage.etd}" dateStyle="short" pattern="dd/MM/yyyy"/>							
							</td>
							<td>
								<fmt:formatDate value="${voyage.enscutoff}" dateStyle="short" pattern="dd/MM/yyyy"/>							
							</td>
							<td>
								<fmt:formatDate value="${voyage.acdsicutoff}" dateStyle="short" pattern="dd/MM/yyyy"/>
							</td>
							<td>
								<a href="#" onclick="javascript: edit('${voyage.voyageid}');" >Edit</a>
							</td>
						</tr>
					</c:forEach>
				</tbody>
		</table>
		<br>
		<br>
		<br>
		<button class="btn btn-primary" type="button" id="addVoyage"><s:message code="voyageForm.addheader" /></button>
		</form:form>
		 <%@ include file="Footer.jsp"%>
	</div>
</body>
</html>